// configureStore 简化了之前创建store的配置选项，可以内置多个reducer，并且配置redux-middleware，并且可在其中启用Redux Devtools扩展。 
import { configureStore } from '@reduxjs/toolkit';
// 多个Slice的引入；
import UserSliceReducer from './UserSlice/UserSlice'
import WriteSliceReducer from './WriteSlice/WriteSlice'
import TodoSliceReducer from './TodoSlice/TodoSlice'
import DetailSliceReducer from './DetailSlice/DetailSlice'
import SettingSliceReducer from './SettingSlice/SettingSlice'
// persistStore 为redux-persist内置的状态管理仓库；
// persistReducer 为内置的切片管理；
import { persistStore, persistReducer } from 'redux-persist';
// storage redux-persist的思想是将要存储的数据通过storage存储在本地localstorage中；
import storage from 'redux-persist/lib/storage';
import autoMergeLevel2 from 'redux-persist/lib/stateReconciler/autoMergeLevel2';

// 配置要存储的Slice；（就是reducer）
const persistConfig = {
    key: 'root',
    storage: storage,
    stateReconciler: autoMergeLevel2
};

// 需要持久性的数据
const myPersistUserSliceReducer = persistReducer(persistConfig, UserSliceReducer)
const myPersistWriteSliceReducer = persistReducer(persistConfig, WriteSliceReducer)
const myPersistTodoSliceReducer = persistReducer(persistConfig, TodoSliceReducer)
const myPersistDetailSliceReducer = persistReducer(persistConfig, DetailSliceReducer)
const myPersistSettingSliceReducer = persistReducer(persistConfig, SettingSliceReducer)

export const store = configureStore({
    // 通过configureStore可内置reducer & middleware
    reducer: {
        UserSliceReducer: myPersistUserSliceReducer,
        WriteSliceReducer: myPersistWriteSliceReducer,
        TodoSliceReducer: myPersistTodoSliceReducer,
        DetailSliceReducer: myPersistDetailSliceReducer,
        SettingSliceReducer: myPersistSettingSliceReducer,
    },
    // 中间件
    middleware: getDefaultMiddleware => {
        return getDefaultMiddleware({
            serializableCheck: false
        });
    },
})
export const persistor = persistStore(store)
// *** store对象 && 包裹store的persistStore都需导出，并在index.tsx中引入；